import React, { useCallback, useImperativeHandle, useRef, useState } from 'react';
import { intl } from '@/utils';
import TreeList, { Column } from 'devextreme-react/tree-list';
import { useModel } from 'umi';
import notify from 'devextreme/ui/notify';
import { getStackStatus } from '@/pages/projectManager/tools';
import { getOnlineZcbfList } from '../../service';
import PubSub from 'pubsub-js';

const Zcbfpopup = React.forwardRef((props: any, ref: any) => {

    const { initialState } = useModel('@@initialState');
    const { curUser } = initialState || {};
    const [modalTableTreeData, setModalTableTreeData] = useState<any>([]);
    const treeListRef = useRef<any>();

    useImperativeHandle(ref, () => ({
        getSelectedRowsZcbfData: () => {
            treeListRef.current.instance.clearFilter();
            const tempdata = treeListRef.current.instance.getSelectedRowsData();
            const zcbfIDString = tempdata.map((item: any) => `'${item.zcbfID}'`).join(",");
            return {
                rowsData: tempdata,
                zcbfIDString,
                modalTableTreeData
            }
        },
        resetTreeList: () => {
            setModalTableTreeData([]);
            // treeListRef.current.instance.updateDimensions();
            return treeListRef.current.instance.clearFilter();
        }
        // getSelectedZcbfDataStr: () => {
        //     const tempdata = treeListRef.current.instance.getSelectedRowsData();
        //     const zcbfIDString = tempdata.map((item: any) => `'${item.zcbfID}'`).join(",");
        //     return zcbfIDString || '';
        // },
    }));
    const getTreeListData = useCallback(async (rowsData: any) => {
        if (!rowsData.projectCode) return;
        const res = await getOnlineZcbfList({
            projectID: rowsData.projectCode,
            usercode: curUser?.usercode,
        });
        if (res.success) {
            setModalTableTreeData(res.data);
        } else {
            notify({ message: "请求报错：", position: 'top center' }, "error", 1000);
        }

    }, []);

    PubSub.unsubscribe('ProjectPopupInfo');
    PubSub.subscribe('ProjectPopupInfo', (msg: any, data: any) => {
        if (data.msg === 'ProjectPopupInfoData') {
            getTreeListData(data.data);
        } else if (data.msg === 'clearProjectPopupInfoData') {
            setModalTableTreeData([]);
        }
    });

    return (
        <TreeList
            ref={treeListRef}
            height={`calc(100%)`}
            dataSource={modalTableTreeData}
            keyExpr="zcbfID"
            parentIdExpr="pZcbfID"
            autoExpandAll={true}
            showColumnLines={true}
            allowColumnResizing={true}
            showBorders={true}
            columnMinWidth={100}
            columnResizingMode="widget"
            showRowLines={true}
            scrolling={{ rowRenderingMode: 'virtual' }}
            loadPanel={{ enabled: true }}
            searchPanel={{ width: 220, visible: true, placeholder: '' }}
            // columnChooser={{ enabled: true, mode: "select", allowSearch: true }}
            selection={{ mode: "multiple", allowSelectAll: true }}
            // onSelectionChanged={onTableTreeSelection}
            paging={{
                enabled: false
            }}
        >
            <Column
                caption={intl('pro.TreeList.ComponentNumber', '组成部分编号')}
                dataField='zcbfID'
                width={180}
            />
            <Column
                caption={intl('pro.TreeList.ComponentName', '组成部分名称')}
                dataField='zcbfName'
            />
            <Column
                caption={intl('pro.TreeList.IntegratedAudit', '状态')}
                dataField='partState'
                fixed={true}
                fixedPosition='right'
                width={100}
                cellRender={(data: any) => (
                    getStackStatus(data.value)
                )}
            />
        </TreeList>
    );
})
export default Zcbfpopup;
